<html lang="zh-cn">

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
  <title>智慧工地管理平台</title>
  <link rel="stylesheet" type="text/css" href="./css/bootstrap.css" />
  <link rel="stylesheet" type="text/css" href="./css/base.css" />
</head>

<body>
  <!-- header start -->
  <div class="header clearfix">
    <div class="left">
      <div class="logo"></div>
      <h3 class="slogan">南京市六合区智慧工地监管平台</h3>
    </div>
    <div class="right">
      <p class="info">2019年3月21日</p>
      <p class="info">星期四</p>
      <p class="info">温度：12℃</p>
      <p class="info">天气：晴</p>
    </div>
  </div>
  <!-- header end -->
  <div class="container">
    <!-- menu start -->
    <ul class="aside-menu">
      <li class="item">
        <span>视频监控</span>
      </li>
      <li class="item">
        <span>环保监测</span>
      </li>
      <li class="item">
        <span>车辆洗轮管理</span>
      </li>
      <li class="item">
        <span>实名制人员管理</span>
      </li>
      <li class="item">
        <span>塔吊监测</span>
      </li>
      <li class="item">
        <span>渣土车管理</span>
      </li>
      <li class="item">
        <span>其他</span>
      </li>
    </ul>
    <!-- menu end -->
    <!-- content start -->
    <div class="content no-bg">
      <div class="sct-title">
        <div class="inner">
          <span>设备管理</span>
        </div>
      </div>
      <div class="sct-panel">
        <!-- sct-menu start -->
        <div class="sct-menu">
          <ul class="tools">
            <li class="item">
              <i class="icn icn-add"></i>
            </li>
            <li class="item">
              <i class="icn icn-edit"></i>
            </li>
            <li class="item">
              <i class="icn icn-delete"></i>
            </li>
            <li class="item">
              <i class="icn icn-order"></i>
            </li>
            <li class="item">
              <i class="icn icn-search"></i>
            </li>
          </ul>
          <ul class="sct-root">
            <li class="item active">
              <p class="title">工地1-浙江至方（南门龙湖）</p>
              <div class="contents">
                <ul class="list">
                  <li class="canmera">工地1-浙江至方(南门龙湖）</li>
                  <li class="canmera">工地1-浙江至方(南门龙湖）</li>
                  <li class="canmera">工地1-浙江至方(南门龙湖）</li>
                </ul>
              </div>
            </li>
            <li class="item">
              <p class="title">工地2-南京邦尼（雄州初级中学工地）</p>
              <div class="contents">
                <ul class="list">
                  <li class="canmera">工地1-浙江至方(南门龙湖）</li>
                  <li class="canmera">工地1-浙江至方(南门龙湖）</li>
                  <li class="canmera">工地1-浙江至方(南门龙湖）</li>
                </ul>
              </div>
            </li>
            <li class="item">
              <p class="title">工地3-南京明辉（金牛湖野生动物王国</p>
              <div class="contents">
                <ul class="list">
                  <li class="canmera">工地1-浙江至方(南门龙湖）</li>
                  <li class="canmera">工地1-浙江至方(南门龙湖）</li>
                  <li class="canmera">工地1-浙江至方(南门龙湖）</li>
                </ul>
              </div>
            </li>
            <li class="item">
              <p class="title">工地4-荣盛建设（中海棠城公馆）</p>
              <div class="contents">
                <ul class="list">
                  <li class="canmera">工地1-浙江至方(南门龙湖）</li>
                  <li class="canmera">工地1-浙江至方(南门龙湖）</li>
                  <li class="canmera">工地1-浙江至方(南门龙湖）</li>
                </ul>
              </div>
            </li>
            <li class="item">
              <p class="title">工地5-南通华荣（南门龙湖）</p>
              <div class="contents">
                <ul class="list">
                  <li class="canmera">工地1-浙江至方(南门龙湖）</li>
                  <li class="canmera">工地1-浙江至方(南门龙湖）</li>
                  <li class="canmera">工地1-浙江至方(南门龙湖）</li>
                </ul>
              </div>
            </li>
          </ul>
        </div>
        <!-- sct-menu end -->
        <!-- sct-table start -->
        <div class="sct-table sct-device">
          <div class="box">
          <!-- device-btns start -->
          <ul class="device-btns">
            <li class="item">
              <a href="#" class="link-btn tn btn-cyan"><i class="icn"></i><span>增加</span></a>
            </li>
            <li class="item">
              <a href="#" class="link-btn  btn-pink"><i class="icn"></i><span>增加</span></a>
            </li>
            <li class="item">
              <a href="#" class="link-btn  btn-pure"><i class="icn"></i><span>增加</span></a>
            </li>
            <li class="item">
                <a href="#" class="link-btn  btn-blue"><i class="icn"></i><span>增加</span></a>
              </li>
            <li class="item">
              <a href="#" class="link-btn  btn-yellow"><i class="icn"></i><span>增加</span></a>
            </li>
          </ul>
          <!-- device-btns end -->
          <div class="sct-filter">
            <form class="form-inline">
              <div class="form-group filter-form">
                <label class="control-label">关键字:</label>
                <input type="text" class="form-control" placeholder="请输入标题" />
              </div>
              <div class="form-group filter-form">
                <label class="control-label">设备类型:</label>
                <select class="form-control">
                  <option>1</option>
                  <option>2</option>
                  <option>3</option>
                  <option>4</option>
                  <option>5</option>
                </select>
              </div>
              <div class="form-group filter-form">
                <label class="control-label">厂商类型:</label>
                <select class="form-control">
                  <option>1</option>
                  <option>2</option>
                  <option>3</option>
                  <option>4</option>
                  <option>5</option>
                </select>
              </div>
              <div class="form-group filter-form">
                <label class="control-label">添加方式:</label>
                <select class="form-control">
                  <option>1</option>
                  <option>2</option>
                  <option>3</option>
                  <option>4</option>
                  <option>5</option>
                </select>
              </div>
              <div class="form-group filter-form">
                <label class="control-label">在线状态:</label>
                <select class="form-control">
                  <option>1</option>
                  <option>2</option>
                  <option>3</option>
                  <option>4</option>
                  <option>5</option>
                </select>
              </div>
              <div class="form-group filter-form">
                <label class="control-label">视频服务器:</label>
                <select class="form-control">
                  <option>1</option>
                  <option>2</option>
                  <option>3</option>
                  <option>4</option>
                  <option>5</option>
                </select>
              </div>
              <div class="form-group filter-form" style="width:100%;">
                <button type="button" class="btn btn-primary btn-sm">检索</button>
              </div>
          </div>
          <table class="table">
            <thead>
              <tr>
                <td><input type="checkbox"></td>
                <td>编码</td>
                <td>IP/域名</td>
                <td>视频服务器</td>
                <td>设备名称</td>
                <td>设备类型</td>
                <td>所属组织</td>
                <td>在线状态</td>
                <td>操作</td>
              </tr>
            </thead>
            <tbody>
              <tr>
                <td><input type="checkbox"></td>
                <td>10000125</td>
                <td>122.96.42.10</td>
                <td>中心服务器</td>
                <td>
                  <p class="txt">工地51-南京鑫龙源工地51-南京鑫龙源</p>
                </td>
                <td>NVR</td>
                <td>
                  <p class="txt">工地51-南京鑫龙源工地51-南京鑫龙源</p>
                </td>
                <td><i class="u-icn icn-active"></i>在线</td>
                <td><a href="#" class="color-green">编辑</a> | <a href="#" class="color-orange">删除</a></td>
              </tr>
              <tr>
                <td><input type="checkbox"></td>
                <td>10000125</td>
                <td>122.96.42.10</td>
                <td>中心服务器</td>
                <td>
                  <p class="txt">工地51-南京鑫龙源工地51-南京鑫龙源</p>
                </td>
                <td>NVR</td>
                <td>
                  <p class="txt">工地51-南京鑫龙源工地51-南京鑫龙源</p>
                </td>
                <td><i class="u-icn icn-active"></i>在线</td>
                <td><a href="#" class="color-green">编辑</a> | <a href="#" class="color-orange">删除</a></td>
              </tr>
              <tr>
                <td><input type="checkbox"></td>
                <td>10000125</td>
                <td>122.96.42.10</td>
                <td>中心服务器</td>
                <td>
                  <p class="txt">工地51-南京鑫龙源工地51-南京鑫龙源</p>
                </td>
                <td>NVR</td>
                <td>
                  <p class="txt">工地51-南京鑫龙源工地51-南京鑫龙源</p>
                </td>
                <td><i class="u-icn icn-active"></i>在线</td>
                <td><a href="#" class="color-green">编辑</a> | <a href="#" class="color-orange">删除</a></td>
              </tr>
              <tr>
                <td><input type="checkbox"></td>
                <td>10000125</td>
                <td>122.96.42.10</td>
                <td>中心服务器</td>
                <td>
                  <p class="txt">工地51-南京鑫龙源工地51-南京鑫龙源</p>
                </td>
                <td>NVR</td>
                <td>
                  <p class="txt">工地51-南京鑫龙源工地51-南京鑫龙源</p>
                </td>
                <td><i class="u-icn icn-active"></i>在线</td>
                <td><a href="#" class="color-green">编辑</a> | <a href="#" class="color-orange">删除</a></td>
              </tr>
              <tr>
                <td><input type="checkbox"></td>
                <td>10000125</td>
                <td>122.96.42.10</td>
                <td>中心服务器</td>
                <td>
                  <p class="txt">工地51-南京鑫龙源工地51-南京鑫龙源</p>
                </td>
                <td>NVR</td>
                <td>
                  <p class="txt">工地51-南京鑫龙源工地51-南京鑫龙源</p>
                </td>
                <td><i class="u-icn icn-active"></i>在线</td>
                <td><a href="#" class="color-green">编辑</a> | <a href="#" class="color-orange">删除</a></td>
              </tr>
            </tbody>
          </table>
            </div>
          <nav class="sct-pagination">
            <ul class="pagination">
              <li class="disabled">
                <a href="#" aria-label="Previous"><span aria-hidden="true">上一页</span></a>
              </li>
              <li class="active">
                <a href="#">1 <span class="sr-only">(current)</span></a>
              </li>
              <li><a href="#">2</a></li>
              <li><a href="#">3</a></li>
              <li><a href="#">4</a></li>
              <li><a href="#">5</a></li>
              <li>
                <a href="#" aria-label="Next"><span aria-hidden="true">下一页</span></a>
              </li>
            </ul>
          </nav>
        </div>
        <!-- sct-table end -->
      </div>
    </div>
    <!-- content end -->
  </div>
  <script src="./js/jquery.min.js"></script>
  <script>
    $(function () {
      $(".sct-root").on("click", ".item", function (event) {
        var $this = $(this);
        if ($this.hasClass("active")) {
          $this.removeClass("active");
        } else {
          $this.addClass("active");
        }
      });
      $(".sct-root").on("click", ".list", function (event) {
        return false;
      });
    });
  </script>
</body>

</html>